<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no">
    <meta http-equiv="X-UA-Compatible" content="ie=edge,chrome=1">
    <meta name="referrer" content="never">
    <title>访问器属性描述符</title>
    <style>
        * {
            margin: 0;
            padding: 0;
        }
        ul {
            list-style: none;
        }
    </style>
</head>
<body>
    
    <script type="text/javascript">
        /* 
        访问器属性描述符：
            configurable 作用与数据属性描述符中一致
            enumerable   作用与数据属性描述符中一致

            get  为函数，获取对象属性值时调用的方法
            set  为函数，设置对象属性值时调用的方法，参数为 设置的新值
            get/set 函数中的 this 指设置此属性的对象
            get/set 函数中，不能对自身属性进行获取/赋值
        */

        var user = {
            firstName: "太白",
            lastName: "李",

            month: "09",
            year: "2013",
            get birth(){
                return this.year + "/" + this.month;
            },
            set birth(v){
                this.year = v.split("/")[0];
                this.month = v.split("/")[1];
            }
        }

        Object.defineProperties(user, {
            fullName: {
                get: function(){
                    console.log("读取 fullName 执行");
                    return this.lastName + this.firstName;
                },
                set(v){
                    console.log("设置 fullName 执行， 有一个参数为：", v);
                    this.lastName = v[0];
                    this.firstName = v.slice(1);

                }
            }
        })

        console.log("user.fullName", user.fullName); // 李太白

        user.fullName = "苏东坡";
        console.log(user);


        console.log(user.birth);
        user.birth = "2011/06";
        console.log(user);
    </script>
</body>
</html>